<%@page import="com.wanmait.cookbook.vo.RecipeType"%>
<%@page import="com.wanmait.cookbook.vo.Pager"%>
<%@page import="com.wanmait.cookbook.vo.Cookbook"%>
<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%String path = request.getContextPath(); %>
<jsp:include page="/manage/inc/head.jsp"></jsp:include>
<jsp:include page="/manage/inc/menu.jsp"></jsp:include>
<!--/sidebar-->
<div class="main-wrap">

	<div class="crumb-wrap">
		<div class="crumb-list">
			<i class="icon-font"></i><a href="<%=path%>/manage/index.jsp">首页</a><span
				class="crumb-step">&gt;</span><span class="crumb-name">食谱管理</span>
		</div>
	</div>
	<div class="search-wrap">
		<div class="search-content">
			<form action="<%=path %>/CookbookTypeManageServlet?action=findCookbookTypesByInter" id="myform" method="post">
				<table class="search-tab">

					<tr>
						<th width="70">关键字:</th>
						<td><input class="common-text" placeholder="请输入一级食谱分类名"
							name="val" id="find" type="text"></td>
						<td><input class="btn btn-primary btn2" id="findbut" name="sub" value="查询"
							type="button"><span style="color:red" id="findspan"></span></td>
					</tr>
				</table>
			</form>
		</div>
	</div>
	<div class="result-wrap">

		<form name="myform" id="myform1" method="post">
			<div class="result-title">
				<div class="result-list">
					<a href="<%=path%>/manage/cookbookTypeManage/addCookbookType.jsp"><i class="icon-font"></i>新增食谱一级分类</a>
					<a id="batchDel" href="javascript:void(0)"><i class="icon-font"></i>批量删除</a>
				</div>
			</div>
			<div class="result-content">
				<table class="result-tab" width="100%">
					<tr>
						<th class="tc" width="5%"><input class="allChoose" name=""
							type="checkbox"></th>
						<th>序号</th>
						<th>分类名称</th>
						<th>操作</th>
					</tr>
					<%
							String val = (String)request.getAttribute("val");
                        	List<RecipeType> cookbookTypes =(List<RecipeType>)request.getAttribute("cookbookTypes");
                        	for(int i=0;i<cookbookTypes.size();i++) {	
                        %>
					<tr id="tr<%=cookbookTypes.get(i).getId()%>">
						<td class="tc"><input data-id="<%=cookbookTypes.get(i).getId()%>" class="choose" name="id[]"
							type="checkbox"></td>
						<td><%=i+1 %></td>
						<td><input class="update" data-id="<%=cookbookTypes.get(i).getId()%>" value="<%=cookbookTypes.get(i).getTitle() %>" type=text>
							<span style="color:red"></span></td>
						<td><a class="link-del"
							id="del<%=cookbookTypes.get(i).getId() %>"
							href="javascript:void(0)">删除</a></td>
					</tr>
					<%
                        	}
                        %>
				</table>
					<div class="list-page">
					<!-- 上一页 -->
					<a id="prev" href="javascript:void(0);">上一页</a>
							<!-- 显示数字 -->
							<%Pager pager = (Pager)request.getAttribute("pager"); %>
							<%
							int start = 1;
							int end = pager.getPageCount();
							if(pager.getPageCount()>5)
							{
								start = pager.getPageNo()-2<1?1:pager.getPageNo()-2;
								end = start+4;
								if(end>pager.getPageCount())
								{
									end = pager.getPageCount();
									start = end-4;
								}
							}
							for(int i=start;i<=end;i++)
							{
							%>
								<a class="number" href="javascript:void(0);"><%=i %></a>
							<% 
							}
							%>
							<!-- 显示数字的结束 -->
							<!-- 下一页 -->
					<a id="next" data-id="<%=pager.getPageNo() %>" href="javascript:void(0);">下一页</a>
					共<%=pager.getPageCount() %>页
				</div>
					<script src="<%=request.getContextPath()%>/manage/js/jquery.min.js"></script>
					<script type="text/javascript">
					$(function(){
						//下一页
						$("#next").click(function(){	 
							 	var n =<%=pager.getPageNo()%>
							 	if(n!=<%=pager.getPageCount()%>){
								 $.ajax({
									 url:"<%=request.getContextPath()%>/CookbookTypeManageServlet?action=findCookbookTypeByInterPager",
										type:"post",
										data:{pageNo:n+1},
										success:function(mes){
							
											$(".result-content").html(mes);
										}
									});//ajax的结束
							 	}
						});
					
					});
					</script>
			</div>
		</form>
	</div>
</div>
<!--/main-->
<jsp:include page="/manage/inc/foot.jsp"></jsp:include>
<script>

 $(function(){
	 
	//全选与反选
		$(".result-content").on("click",".allChoose",function(){
			$(".choose").prop("checked",$(".allChoose").prop("checked"));
		});
	//单个删除
		$(".result-content").on("click",".link-del",function(){
			var th = $(this);
			if(!window.confirm("确定要删除吗！")){
				//取消超级链接的默认行为
				//或者href="javascript:void(0)"bbb
				return;
			}
			var id = $(this).attr("id").substring(3);

			$.ajax({
				url:"<%=path%>/CookbookTypeManageServlet?action=deleteCookbookType",
				data:{id:id},
				success:function(){
					var n =$("#next").data("id");
					$.ajax({
						url:"<%=request.getContextPath()%>/CookbookTypeManageServlet?action=findCookbookTypeByInterPager",
						type:"post",
						data:{pageNo:n,val:val},
						success:function(mes){
			
							$(".result-content").html(mes);
						}
					});//ajax的结束
				}
			});
			
		});
	
		//删除全选按钮
		$("#batchDel").click(function(){
			 var  idArr = [];
			 $(".choose:checked").each(function(){
				 var id=$(this).data("id");
				 idArr.push(id);
			 })
			 if(idArr.length>0){
				 $.get("<%=path %>/CookbookTypeManageServlet?action=batchDelete",
						 {ids:idArr.toString()},
						 function(){
							 var n =$("#next").data("id");
								$.ajax({
									url:"<%=request.getContextPath()%>/CookbookTypeManageServlet?action=findCookbookTypeByInterPager",
									type:"post",
									data:{pageNo:n,val:val},
									success:function(mes){
						
										$(".result-content").html(mes);
									}
								});//ajax的结束
					 })
			 }
			 
		});
		//分页
		$(".result-content").on("click",".number",function(){
			//点击数字的时候执行
			//点击的数字变红
			$(".number").css("color","black");//所有数字变成黑色
			$(this).css("color","red");//点击的数字变成红色
			var val="<%=val%>"
			//获得点击的数字  $(this)是点击的a
			var n = $(this).html();
			//content是点击的a中间的内容  点击数字
			//从数据库中间查出新的一页的数据
			//Ajax
			$.ajax({
				url:"<%=request.getContextPath()%>/CookbookTypeManageServlet?action=findCookbookTypeByInterPager",
				type:"post",
				data:{pageNo:n,val:val},
				success:function(mes){
	
					$(".result-content").html(mes);
				}
			});//ajax的结束
			
		});//click事件的结束
		
		//搜索框不能为空
		$("#findbut").click(function(){
			var val =$("#find").val();
			if(val==""){
				$("#findspan").html("不能为空");
			}else{
				$("#findspan").html("");
				$("#myform").submit();
			}
		});
		
		

		//修改类型
		  $(".result-content").on("blur",".update",function(){
			var val=$(this).val();
			var id=$(this).data("id");
			var spa=$(this).next();
			if(val==""){
				$(this).select();
				spa.html("不能为空");
			}else{
				spa.html("");
			$.ajax({
				url:"<%=path%>/CookbookTypeManageServlet?action=updateCookbookType",
				type:"post",
				data:{val:val,id:id},
				success:function(){
			
				}
			});
			}
		});
		
	});
</script>